<!-- head - 开始 -->
<? require(dirname(dirname(__FILE__)).'/public/head.html'); ?>
<!-- head - 结束 -->

</head>
<? require(dirname(dirname(__FILE__)).'/public/body.html'); ?>
    <div class="wrapper" id="edit-profile">
        
        <!-- 侧边栏 - 开始 -->
        <i-left-side></i-left-side>
        <!-- 侧边栏 - 结束 -->
        
        <div class="content-page">
            
            <div class="content">
                
                <!-- 顶部导航 - 开始 -->
                <i-top-nav></i-top-nav>
                <!-- 顶部导航 - 结束 -->
                
                <!-- 内容 - 开始 -->
                <div class="container-fluid">
                
                    <!-- 页面标题 开始 -->
                    <div class="row">
                        <div class="col-12">
                            <div class="page-title-box">
                                <div class="page-title-right">
                                    <form class="form-inline">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <input type="text" class="form-control form-control-light" id="dash-daterange">
                                                <div class="input-group-append">
                                                    <span class="input-group-text bg-primary border-primary text-white">
                                                        <i class="mdi mdi-calendar-range font-13"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                        <a href="/index/EditProfile" class="btn btn-primary ml-2">
                                            <i class="mdi mdi-autorenew"></i>
                                        </a>
                                    </form>
                                </div>
                                <h4 class="page-title">个人资料</h4>
                            </div>
                        </div>
                    </div>
                    <!-- 页面标题 结束 -->
                
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card bg-primary">
                                <div class="card-body profile-user-box">
                
                                    <div class="row">
                                        <div class="col-sm-8">
                                            <div class="media">
                                                <span class="float-left m-2 mr-4">
                                                    <input v-show="false" v-on:change="upload($event)" type="file" accept="image/*" id="btn_file" />
                                                    <img v-on:click="clickUpload()" :src="login_account.head_img" style="height: 100px;" alt="" class="rounded-circle img-thumbnail pointer">
                                                </span>
                                                <div class="media-body">
                
                                                    <h4 class="mt-1 mb-1 text-white">{{login_account.nickname}}</h4>
                                                    <p class="font-13 text-white-50">{{login_account.description}}</p>
                
                                                    <ul v-if="false" class="mb-0 list-inline text-light">
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">5482</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的文章</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的评论</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">2184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                
                                        <div v-if="false" class="col-sm-4">
                                            <div class="text-center mt-sm-0 mt-3 text-sm-right">
                                                <a href="/index/profile" class="btn btn-light">
                                                    <i class="mdi mdi-account-edit mr-1"></i>个人资料
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row" id="edit-profile1" :value="login_account.id">
                        <div class="col-xl-6">
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">个人信息</h4>
                                    <div class="tab-content mb-0 b-0">
                                        <div class="tab-pane fade active show">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">昵称</label>
                                                        <div class="col-md-9">
                                                            <input v-model="login_account.nickname" type="text" class="form-control" placeholder="您的称呼">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">性别</label>
                                                        <div class="col-md-9 sex">
                                                            <select id="sex-select2" class="form-control select2" data-toggle="select2"></select>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">描述</label>
                                                        <div class="col-md-9">
                                                            <input v-model="login_account.description" type="text" class="form-control" placeholder="">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">头像地址</label>
                                                        <div class="col-md-9">
                                                            <!--v-on:click="clickUpload()"-->
                                                            
                                                            <div class="input-group">
                                                                <input v-model="login_account.head_img" type="text" class="form-control" placeholder="填写或点击按钮上传">
                                                                <!--<input v-model="login_account.qq_pay" type="text" class="form-control" placeholder="填写收款码地址或点击按钮上传">-->
                                                                <div class="input-group-append">
                                                                    <button v-on:click="clickUpload()" class="btn btn-dark" type="button">上传</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">主页地址</label>
                                                        <div class="col-md-9">
                                                            <input v-model="login_account.address_url" type="text" class="form-control" placeholder="">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">赞赏配置</label>
                                                        <div class="col-md-9">
                                                            <button type="button" class="btn btn-block btn-light" data-toggle="modal" data-target="#fill-praise-modal">点击配置</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                
                        <div class="col-xl-6">
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">帐号安全</h4>
                                    <div class="tab-content mb-0 b-0">
                                        <div class="tab-pane fade active show">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">登录帐号</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="帐号" v-model="login_account.account" onkeyup="this.value=this.value.replace(/\s+/g,'')">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">邮箱地址</label>
                                                        <div class="col-md-9">
                                                            <input type="email" class="form-control" placeholder="用于找回密码或邮箱登录" v-model="login_account.email" onkeyup="this.value=this.value.replace(/\s+/g,'')">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">手机号码</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="用于找回密码或手机登录" v-model="login_account.phone" maxlength="11" onkeyup="this.value=this.value.replace(/[^\d]/g,'')">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">修改密码</label>
                                                        <div class="col-md-9">
                                                            <input type="password" class="form-control" v-model="password1" placeholder="请输入新密码" onkeyup="this.value=this.value.replace(/\s+/g,'')">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">确认密码</label>
                                                        <div class="col-md-9">
                                                            <input type="password" class="form-control" v-model="password2" placeholder="请再次输入新密码" onkeyup="this.value=this.value.replace(/\s+/g,'')">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Token 验证说明 - 开始 -->
                    <div id="fill-praise-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="fill-primary-modalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content modal-filled bg-primary">
                                <div class="modal-header">
                                    <h4 class="modal-title" id="fill-token-modalLabel">什么是 赞赏配置 ？</h4>
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                </div>
                                <div class="modal-body">
                                    <p>文章详情页会展示赞赏的二维码，用于用户打赏作者，激励创作</p>
                                    <div class="row">
                                        <div class="col-lg-12">
                                            <div class="card-body pb-0">
                                                <div class="form-group row mb-3">
                                                    <label class="col-3 col-form-label">QQ</label>
                                                    <div class="col-9">
                                                        <div class="input-group">
                                                            <input v-model="login_account.qq_pay" type="text" class="form-control" placeholder="填写收款码地址或点击按钮上传">
                                                            <div class="input-group-append">
                                                                <input v-show="false" v-on:change="uploadPay($event, 'qq_pay')" type="file" accept="image/*" id="qq-pay" />
                                                                <button v-on:click="qqClick" class="btn btn-dark" type="button">上传</button>
                                                            </div>
                                                        </div>
                                                        <div v-if="qq_speed != 1 && qq_speed != 0" class="progress-w-percent users-upload-head">
                                                            <div class="progress progress-sm">
                                                                <div class="progress-bar" role="progressbar" :style="'width: '+ qq_speed * 100 +'%'" aria-valuenow="72" aria-valuemin="0" aria-valuemax="100"></div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group row mb-3">
                                                    <label class="col-3 col-form-label">微信</label>
                                                    <div class="col-9">
                                                        <div class="input-group">
                                                            <input v-model="login_account.wechat_pay" type="text" class="form-control" placeholder="填写收款码地址或点击按钮上传">
                                                            <div class="input-group-append">
                                                                <input v-show="false" v-on:change="uploadPay($event)" type="file" accept="image/*" id="wechat-pay" />
                                                                <button v-on:click="wechatClick" class="btn btn-dark" type="button">上传</button>
                                                            </div>
                                                        </div>
                                                        <div v-if="wechat_speed != 1 && wechat_speed != 0" class="progress-w-percent users-upload-head">
                                                            <div class="progress progress-sm">
                                                                <div class="progress-bar" role="progressbar" :style="'width: '+ wechat_speed * 100 +'%'" aria-valuenow="72" aria-valuemin="0" aria-valuemax="100"></div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group row mb-3">
                                                    <label class="col-3 col-form-label">支付宝</label>
                                                    <div class="col-9">
                                                        <div class="input-group">
                                                            <input v-model="login_account.alipay" type="text" class="form-control" placeholder="填写收款码地址或点击按钮上传">
                                                            <div class="input-group-append">
                                                                <input v-show="false" v-on:change="uploadPay($event, 'ali')" type="file" accept="image/*" id="ali-pay" />
                                                                <button v-on:click="aliClick" class="btn btn-dark" type="button">上传</button>
                                                            </div>
                                                        </div>
                                                        <div v-if="ali_speed != 1 && ali_speed != 0" class="progress-w-percent users-upload-head">
                                                            <div class="progress progress-sm">
                                                                <div class="progress-bar" role="progressbar" :style="'width: '+ ali_speed * 100 +'%'" aria-valuenow="72" aria-valuemin="0" aria-valuemax="100"></div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-outline-light" data-dismiss="modal">关闭</button>
                                    <button v-on:click="btnSave()" type="button" class="btn btn-light" data-dismiss="modal">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Token 验证说明 - 结束 -->
                
                    <!-- 保存 -->
                    <div class="inis-save">
                        <button type="button" class="btn btn-icon btn-primary" v-on:click="btnSave()">
                            <svg t="1603529849300" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4317" width="20" height="20">
                                <path d="M0 1024V0h160v320h512V0h96l256 256v768H0z m864-512H160v320h704V512z" fill="#fafbfe" p-id="4318" data-spm-anchor-id="a313x.7781069.0.i11" class="selected"></path>
                                <path d="M416 0h160v256h-160z" fill="#fafbfe" p-id="4319" data-spm-anchor-id="a313x.7781069.0.i12" class="selected"></path>
                            </svg>
                        </button>
                    </div>
                
                </div>
                <!-- 内容 - 结束 -->
                
            </div>
            
            <!-- 页脚 - 开始 -->
            <i-footer></i-footer>
            <!-- 页脚 - 结束 -->
        </div>
        
        <!-- 右侧边栏 - 开始 -->
        <i-right-side></i-right-side>
        <!-- 右侧边栏 - 结束 -->
    </div>
    
    <script src="<?= __ADMIN_JS__.'vue/edit-profile.js?v='.__VERSION__; ?>"></script>
    
    <!-- 依赖 - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/script.html'); ?>
    <!-- 依赖 - 结束 -->
    
    <!-- APP JS - 开始 -->
    <!-- APP JS - 结束 -->
    
    <!-- footer - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/footer.html'); ?>
    <!-- footer - 结束 -->
